<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
         img{
        width: 200px;
        height: 200px;
    }
    </style>
</head>
<body>
    <h1>结算</h1>
    <ul>
        
    </ul>
    <h1 class="yi">总价：<span></span><button onclick="fu()">结算</button></h1>
    <script>
        var a=localStorage.getItem('9')
        var b=JSON.parse(a)
        console.log(b);
       var ul= document.querySelector('ul')
       var yi= document.querySelector('.yi span')
var zong=0
        b.forEach(item=>{
            console.log(item);
            ul.innerHTML+=`
            <li>
               <img src="${item.img}" alt=""> 
                <span>${item.name}</span><span>价格：${item.Price}</span><span>数量：${item.shu}</span></li>`
                zong+=item.shu*item.Price
                console.log(zong);
                
                yi.innerHTML=`${zong}`
        })
        function fu(){
            alert('结算成功')
        }
    </script>
</body>
</html>